<template>
	<view class="record">
		<!-- #ifndef H5 -->
		<topTitle :styles="{back:true,title:'充值记录',color:'#fff'}" />
		<!-- #endif -->
		<view class="date" v-if="list.length != 0">
			<view class="list">
				<view class="list_item" v-for="(item,index) in list" :key="index">
					<view class="">
						<view class="type">
							{{item.desc}}
						</view>
						<view class="change">
							{{item.change}}
						</view>
					</view>
					<view class="">
						<view class="change_time">
							{{item.create_time}}
						</view>
						<view class="">
							余额：{{item.balance}}
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="no_more" v-else>
			<view class="orders_listto">
				<image src="/static/images/orders/not.png" mode=""></image>
				<view class="">
					暂无数据 ~
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import topTitle from "@/components/topTitle.vue"
	export default {
		components:{
			topTitle
		},
		data() {
			return {
				list:[]
			}
		},
		onLoad() {
			this.getList()
		},
		methods: {
			getList(){
				this.$http({
					url:'/api/user/balance/list?type=recharge',
					method:'get',
					success:result=>{
						this.list = result.data.list
						console.log(result,'----------------1')
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	page{
		width: 100%;
		height: 100%;
	}
	.record{
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		.date{
			padding: 20px;
			.list{
				display: flex;
				flex-direction: column;
				.list_item{
					display: flex;
					flex-direction: column;
					background-color: #fff;
					padding: 20upx 35upx;
					border-radius: 15upx;
					margin-bottom:10px;
					>view{
						display: flex;
						align-items: center;
						justify-content: space-between;
						margin: 20upx 0;
					}
				}
			}
		}
		.no_more{
			.orders_listto{
				font-size: 14px;
				text-align: center;
				color: #9e9e9e;
				>image{
					width: 200rpx;
					height: 200rpx;
					margin: 100rpx 0 40rpx 0;
				}
			}
		}
	}
	
</style>
